<template>
  <div class="diy_edit auth_edits" id="auth_edit">
    <el-form
      :model="form"
      ref="ruleFormRef"
      label-width="auto"
      class="edit_auth_form"
      size="large"
    >
      <el-row class="row_e">
        <el-col :xs="24" :sm="12" :lg="12" class="el_form_item_warp">
          <el-form-item label="用户组">
            <el-select :disabled="true" v-model="form.user_group">
              <el-option
                v-for="(o, i) in user_group"
                :key="o.name"
                :value="o.name"
                :label="o.name"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>

        <el-col :xs="24" :sm="12" :lg="12" class="el_form_item_warp">
          <el-form-item label="权限名称">
            <el-input :disabled="true" v-model="mod_name_show"></el-input>
          </el-form-item>
        </el-col>

        <el-col :xs="24" :sm="12" :lg="6" class="el_form_item_warp">
          <el-form-item label="是否可增加">
            <el-switch
              v-model="form.add"
              active-text="是"
              inactive-text="否"
              active-value="1"
              inactive-value="0"
            >
            </el-switch>
          </el-form-item>
        </el-col>

        <el-col :xs="24" :sm="12" :lg="6" class="el_form_item_warp">
          <el-form-item label="是否可删除">
            <el-switch
              v-model="form.del"
              active-text="是"
              inactive-text="否"
              active-value="1"
              inactive-value="0"
            >
            </el-switch>
          </el-form-item>
        </el-col>

        <el-col :xs="24" :sm="12" :lg="6" class="el_form_item_warp">
          <el-form-item label="是否可修改">
            <el-switch
              v-model="form.set"
              active-text="是"
              inactive-text="否"
              active-value="1"
              inactive-value="0"
            >
            </el-switch>
          </el-form-item>
        </el-col>

        <el-col :xs="24" :sm="12" :lg="6" class="el_form_item_warp">
          <el-form-item label="是否可查询">
            <el-switch
              v-model="form.get"
              active-text="是"
              inactive-text="否"
              active-value="1"
              inactive-value="0"
            >
            </el-switch>
          </el-form-item>
        </el-col>
      </el-row>
      <div class="footer">
        <el-button type="primary" @click="Onsubmit" size="large"
          >提交</el-button
        >
        <el-button @click="cancel()" size="large">取消</el-button>
      </div>
    </el-form>
  </div>
</template>

<script setup>
import { ref, onMounted } from "vue";
import { ElMessage } from "element-plus";
import { $post, $get } from "@/api/Api.js";
import storageHelper from "@/libs/StorageHelper";
import { useStore } from "vuex";
import { useRouter } from "vue-router";
import {$getUrlParams} from "@/utils/utils.js";
let router = useRouter();
let store = useStore();
let token = storageHelper.getToken() || null;
let UserInfo = storageHelper.getUserInfo();
let auth_id = $getUrlParams().auth_id;
let url_set = ref("/api/auth/set");
let url_get_obj = ref("/api/auth/get_obj");
let title = ref("auth");
let field = ref("auth_id");
let form = ref({
  auth_id: 0,
  user_group: "",
  mod_name: "",
  table_name: "",
  page_title: "",
  path: "",
  add: "",
  del: "",
  set: "",
  get: "",
  position: "",
  field_add: "",
  field_set: "",
  field_get: "",
  table_nav_name: "",
  table_nav: "",
  option: "",
});
let user_group = ref([]);
let mod_name_show = ref("");
let ruleFormRef = ref(null);
let get_obj_after=(json, func)=>{
        if (form.value.path.replace('/'+form.value.table_name+'/','')=='table'){
          mod_name_show.value = form.value.mod_name+'后台列表'
        }
        if (form.value.path.replace('/'+form.value.table_name+'/','')=='view'){
          mod_name_show.value = form.value.mod_name+'后台详情'
        }
        if (form.value.path.replace('/'+form.value.table_name+'/','')=='list'){
          mod_name_show.value = form.value.mod_name+'前台列表'
        }
        if (form.value.path.replace('/'+form.value.table_name+'/','')=='details'){
          mod_name_show.value = form.value.mod_name+'前台详情'
        }
        if (form.value.path.replace('/'+form.value.table_name+'/','')=='edit'){
          mod_name_show.value = form.value.mod_name+'前台编辑'
        }
      }
// 点击取消
let cancel = () => {
  router.go(-1);
};
// 点击提交
let Onsubmit = async () => {
    // 编辑
    delete form.value.update_time;
    $post(url_set.value + "?auth_id=" + auth_id, form.value).then((res) => {
      if (res.result) {
        ruleFormRef.value.resetFields();
        router.push("/home/auth/table");
        ElMessage.success("提交成功！");
      } else if (res.error) {
        ElMessage.error(res.error.message);
      }
    });

};

// 获取详情后
let get_auth_obj = async () => {
  var list = await $get(url_get_obj.value + "?auth_id=" + auth_id);
  form.value = list.result.obj;
  get_obj_after()
};

// 获取用户组
let get_user_group = async () => {
  let json = await $get("/api/user_group/get_list");
  if (json.result) {
    list_user.value = json.result.list;
  } else if (json.error) {
    console.error(json.error);
  }
};
onMounted(() => {
	get_user_group();
	get_auth_obj()
});
</script>

<style scoped lang="less">
.diy_edit {
  width: 100%;
  .edit_auth_form {
    max-width: 60%;
    margin: 90px auto;
    .fn {
      width: 100%;
    }
  }
  img {
    width: 100px;
    height: 100px;
  }
  .edit_list_auth_sell {
    width: 80%;
    margin: 90px auto;
  }
  .footer {
    text-align: center;
  }
}
</style>
